@charset "utf-8";
@include ns(form-input){
  display: inline-block;position: relative;
  [class*="ak-icon-"]{font-family: FontAwesome;display: block;position: absolute;right: 0;top: 50%;transform: translateY(-50%);font-size: 20px;cursor: pointer;transition: all .3s;width: 30px;height: 30px;text-align: center;line-height: 30px;color: #999}
  @include ns(icon-clear){display: none;
    &:after{content: '\f057';}
  }
  @include ns(icon-eye){right: 30px;
    &:after{content: '\f070';}
    &.eye-show{
      &:after{content: '\f06e';}
    }
  }
  &:hover{
    @include ns(icon-clear){display: block}
  }
}
@include ns(input-control){
  $border: #ddd;
  $focus: #f60;
  $error: red;
  height: 38px;line-height: 38px;border: 1px solid #ddd;border-radius: 3px;background: none;outline: none;padding: 0 10px;font-size: 14px;overflow: hidden;box-sizing: border-box;width: 300px;
  &:hover{border-color: #ccc}
  &:focus,&.focus{border-color: $focus}
  &.placeholder{color: #999}
  /*禁用状态*/
  &.disabled{background: #eee;cursor: not-allowed;}
  @at-root{
    // formItem里输入错误状态
    @include ns(form-item-error){
      @include ns(input-control){border-color: $error;}
    }
  }
}
